import React from "react";
import { ListItemRawState } from "../../types";
import './style.scss'
interface PropsType {
  v: ListItemRawState
  onClick?: Function
  preLeft?: JSX.Element
  desc?: JSX.Element | string
}

export const ListItem: React.FC<PropsType> = ({ v, onClick, preLeft, desc }) => {
  return (
    <div className="list-item" onClick={ () => onClick && onClick() }>
      <dl>
        <dt>
          {preLeft}
        </dt>
        <dt>
          <img src={v.images[0]} alt="" />
        </dt>
        <dd>
          <h3>{v.title}</h3>
          { desc }
        </dd>
      </dl>
    </div>
  )
}

export default ListItem